<page-header title="用户管理"></page-header>
<nz-card>
  <div style="margin-bottom: 20px;">
    <button nz-button [nzType]="'primary'" (click)="editEntity({})">
      <i class="anticon anticon-plus"></i><span>添加</span>
    </button>
    <button nz-button [nzType]="'primary'" (click)="testObserver()">
      <span>测试按钮</span>
    </button>
  </div>
  <nz-table #nzTable [nzData]="page.data"
            [nzPageSize]="page.per_page"
            [nzTotal]="page.total"
            [(nzPageIndex)]="page.current_page"
            (nzPageIndexChange)="changePageNo($event)"
            [nzLoading]="isLoading">
    <thead>
    <tr>
      <th nz-th><span>序号</span></th>
      <th nz-th><span>姓名</span></th>
      <th nz-th><span>角色</span></th>
      <th nz-th><span>邮箱</span></th>
      <th nz-th><span>操作</span></th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let data of nzTable.data;let i=index">
      <td>
        {{i+1}}
      </td>
      <td>{{data.name}}</td>
      <td>{{data.role}}</td>
      <td>{{data.email}}</td>
      <td>
        <a href="javascript:void (0);" (click)="editEntity(data)">查看详情</a>

        <!--<nz-divider nzType="vertical"></nz-divider>
        <nz-popconfirm [nzTitle]="'确定要删除这条数据吗？'" (nzOnConfirm)="delete(data)">
          <a nz-popconfirm>删除</a>
        </nz-popconfirm>-->
      </td>
    </tr>
    </tbody>
  </nz-table>
</nz-card>
